<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="../static/layui/css/layui.css" />
    <style type="text/css">
      .layui-input {
        border-radius: 5px;
        width: 300px;
        height: 38px;
        font-size: 16px;
      }

      div {
        margin-top: 10px;
      }

      label {
        font-size: 22px;
        /* 背景透明 */
        color: transparent;
        /* 文字背景 */
        -webkit-background-clip: text;
        background-image: linear-gradient(to bottom, #72C6EF, #004E8F);
      }
    </style>
  </head>
  <body>
    <div class="panel panel-info" style="width: calc(30vh); margin:0 auto;">
      <!-- <form action="home.html" method="post"> -->

      <form class="layui-form" th:action="@{/addData}" method="post">
        <input type="hidden" th:value="${token}" id="token" name="token">
        <div class="container">

          <div>
            <label>用户名称</label>
            <div>
              <input type="text" id="username" name="username" placeholder="请输入用户名称" class="layui-input">
            </div>
          </div>

          <div>
            <label>用户邮箱</label>
            <div>
              <input type="email" id="useremail" name="useremail" placeholder="请输入用户邮箱" class="layui-input">
            </div>
          </div>

          <div>
            <label>用户密码</label>
            <div>
              <input type="password" id="passWord" name="passWord" placeholder="请输入密码" class="layui-input">
            </div>
          </div>
          <button class="layui-btn-group" type="submit" id="ok">Submit</button>
        </div>
      </form>

    </div>
    <script src="../static/jquery/jquery-3.6.0.min.js"></script>
    <script src="../static/layui/layui.js"></script>
    <script>
      $(document).ready(function() {
        $('div').click(function() {
          console.log("你点击了输入框")
        });
      });
    </script>
  </body>
</html>
